iT邦幫忙

2024 iThome 鐵人賽

DAY 2
0
佛心分享-IT 人自學之術

JavaScript自學分享系列 第 2

Day02 — JavaScript 疑難排解、流程控制與例外處理

  • 分享至 

  • xImage
  •  

大家好~我是姐姐恩!身為資訊小白的我,起初對於參賽主題非常苦惱,最後決定利用此次機會,延續學校的課(Java),了解網頁前端三劍客之一的JavaScript!
所以接下來30天,我將在這裡紀錄我當天的學習筆記及統整後的學習內容,請大家多多指教!
*學習內容主要取自MDN Web Docs及彭彭老師的YT課程。

Day02 — JavaScript 疑難排解、流程控制與例外處理

JavaScript 疑難排解

  • 指派運算子(=):用於賦予變數值
  • 嚴格比較運算子(===):用於比較兩個值是否完全相等,並回覆true/false布林值。
    Math.random(); 表產生一個介於0到1的隨機小數。
    Math.floor()表回傳一個小於等於括號中的數值的最大整數 (無條件捨去取整數)。
  • 語法錯誤:
    函式結尾缺少「}」大括號SyntaxError: missing } after function body、預期得到表達式,但實際得到「字串」SyntaxError: expected expression, got 'string'跟字串字面值未正常結束SyntaxError: unterminated string literal:通常代表漏寫一個字串起始或結尾的引號。

流程控制與例外處理

  • 區塊陳述式:
    JavaScript 在 ECMAScript2015 (第六版)以前的版本並沒有區塊範圍的概念,表示區塊中的陳述式擁有與區塊外的相同的有效範圍,而 ECMAScript2015 版本開始, 使用 let 定義的變數範圍將被限制於區塊內。

Boolean:在判斷式中,任何物件只要不是 undefined 或 null ,儘管是參數值為false 的 Boolean 物件,都會被轉換成true。會被轉換成false的值:0、-0、null、false、undefined、空字串等等。轉換非布林值時,用Boolean函式,或是在值前面使用Double NOT(!!)。

  • 條件陳述式:
    if...else 陳述式:以賦值作爲條件運算式的話,為了避免搞混,額外在賦值式外面加上一組括號,如if((x = y))。
    switch 陳述式:允許程式依運算式的不同值來選擇不同標籤。 假如運算式和標籤匹配,程式會執行標籤對應的陳述式。每一個case子句中添加break陳述式是為避免程序可能一直在switch陳述式中,反覆執行下一個陳述式的動作。

  • 例外處理陳述式:
    throw 陳述式:當拋出例外時,一定要指定包含在要拋出物件中的值並中斷程式碼執行,可以拋出任何東西,包含字串、數字、函式等。
    try…catch陳述式:表示標記了一組要嘗試的陳述式,並在拋出例外時指定一個或多個處理方式,
    return:只能在函式中使用,用來回傳值並中斷函式執行,後面可以不用寫值。
    finally :可加可不加,無論是否拋出例外,finally 區塊都會執行;如果在 try 或 catch 中使用 return 並不會中斷程式碼執行,而是將 try 或 catch 裡的 return 移到 finally 區塊的程式碼最後面執行;如果拋出例外,則即使沒有 catch 區塊處理例外,finally 區塊中的陳述式也會執行。

補充:
今日在搜尋資料時,意外發現這篇很有趣的文章。裡面分享的小知識,不管是對有觸過HTML、JS、CSS的,或是對程式完全不了解的人,只要花費看一部YT影片的時間閱讀,都可以學會的!
其中提到的Snippets,是最讓我感興趣的部分,所以又簡單地了解了一下,整理出以下內容:
正式名稱為「使用者程式碼片段Code Snippet」,功能是可以快速地重複經常撰寫的程式碼,較常保存於JSON文件中,第二篇文章除了製作Snippets的教學,後段也有提及導入及分享Snippets的方式,而如果在更進階一點,就是如第一篇文章中提及的功能,將寫好的JS程式放入……,更詳細內容請參考補充的第三篇文章(有點太多先pass),(溫馨提示:F人的感性時刻,懶得看請跳過!)這讓我想到之前的程式設計課,是使用IntelliJ寫Java,而其開發軟體就自帶快捷鍵,例如經常要撰寫的「system.out.println();」,輸入「sout」後按下Tab鍵即可,頓時,當時上課的回憶又浮現腦海,而這項功能在網路上搜尋的話,較多提及VS Code的教學,但這項功能在其他開發軟體也有,就如同前面提及的IntelliJ也有,只是做法不同而已。

學習資源:
JavaScript 疑難排解
流程控制與例外處理
補充資源:
好用的chrome開發者工具 — 不是工程師的你也該來認識一下
VSCode User Snippets 入門:快速提升編碼效率的必備技巧
Chrome Snippets 執行 JavaScript 程式片段


上一篇
Day01—JavaScript 簡介、HTML 簡介、CSS 簡介、開發環境
下一篇
Day03—變數、基本運算子與表達式、運算式與運算子、數字與日期
系列文
JavaScript自學分享30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言